<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app">
			<anchored-heading :level="4">Hello sdworld!</anchored-heading>
		</div>
		
	</body>
<!-- 	<script type="text/x-template" id="anchored-heading-template">
	  <h1 v-if="level === 1">
	    <slot></slot>
	  </h1>
	  <h2 v-else-if="level === 2">
	    <slot></slot>
	  </h2>
	  <h3 v-else-if="level === 3">
	    <slot></slot>
	  </h3>
	  <h4 v-else-if="level === 4">
	    <slot></slot>
	  </h4>
	  <h5 v-else-if="level === 5">
	    <slot></slot>
	  </h5>
	  <h6 v-else-if="level === 6">
	    <slot></slot>
	  </h6>
	</script> -->
	<script src="../vue.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
Vue.component('anchored-heading', {
  render: function (createElement) {
    return createElement(
      'h' + this.level,   // 标签名称
      this.$slots.default // 子节点数组
    )
  },
  props: {
    level: {
      type: Number,
      required: true
    }
  }
})
		const vm = new Vue({
			el:'#app',
			
		})
	</script>
</html>
